<template>
  <div class="vm-banner-container">
    <mt-swipe :auto="4000">
      <mt-swipe-item><img src="static/images/banner01.png"></mt-swipe-item>
      <mt-swipe-item><img src="static/images/banner02.png"></mt-swipe-item>
      <mt-swipe-item><img src="static/images/banner03.png"></mt-swipe-item>
    </mt-swipe>
  </div>
</template>

<script>
  export default {

  }
</script>

<style lang="scss">
  .vm-banner-container {
    height: 310px;
    img {
      width: 100%;
      height: 100%;
    }
    .swiper-pagination {
      position: static !important;
      width: 100% !important;
      .swiper-pagination-bullet {
        width: 12px;
        height: 12px;
        margin: 0 13px;
      }
      .swiper-pagination-bullet.swiper-pagination-bullet-active {
        width: 36px;
        height: 12px;
        background: #d9261d;
        border-radius: 25%;
      }
    }
  }

</style>



